<template>
	<view class="container">
		<view class="container__sticky__swiperbox__draw-ul" v-for="(item,inx) in drawprize" :key="inx">
			<view class="container__sticky__swiperbox__draw-ul__title"><text>{{item.issue}}期：({{item.open_time}})</text>
				<view class="text-right container__sticky__swiperbox__draw-ul__more"></view>
			</view>
			<template v-for="(vl,vk) in item.open_code">
				<view :key="vk">
					<view  v-if="vk===6" class="container__sticky__swiperbox__draw-ul__li container__sticky__swiperbox__draw-ul__jia">
						+
					</view>
					<view class="container__sticky__swiperbox__draw-ul__li" >
						<view><view class="container__sticky__swiperbox__draw-ul__li__code" :class="'nub-color-'+vl.color">{{vl.nub}}</view></view>
						<view>{{item.open_xiao[vk]}}</view>
					</view>
				</view>
			</template>
			
		</view>
	</view>
</template>

<script>
	import {getDrawprizeList} from '@/api/lottery.js'
	export default {
		data() {
			return {
				drawprize:[],
				alias:''
			}
		},
		onLoad(opt){
			if(!opt || !opt.alias) {
				uni.$u.toast('缺少参数！');
				uni.reLaunch({
					url: '/pages/index/index',
					success: (e) => {
						
					},
					fail: (err) => {
						console.log(err)
					}
				})
				return false;
			}
			this.alias = opt.alias;
			this.initList();
		},
		methods: {
			initList() {
				var map = {
					'alias' : this.alias
				}
				getDrawprizeList(map).then(res=>{
					if(res.code === 200) {
						this.drawprize = res.data.list;
						if(this.drawprize.length && this.drawprize[0].title) {
							uni.setNavigationBarTitle({
							  title: this.drawprize[0].title
							});
						}
					}else{
						uni.$u.toast(res.message);
					}
				});
				
				
			}
		}
	}
</script>

<style lang="scss">
	/* #ifndef APP-PLUS */
	page {
	  width: 100%;
	  min-height: 100%;
	  display: flex;
	}
	/* #endif */
	.container{
		display: flex;
		flex: 1;
		flex-direction: column;
		// overflow: hidden;
		background-color: #ffffff;
		/* #ifdef MP-ALIPAY || MP-BAIDU */
		height: 100vh;
		/* #endif */
		margin: 10rpx;
		&__sticky{
			background-color: #ffffff;
			border-bottom: 1px solid #C0C0C0;
			margin-bottom: 10rpx;
			border-bottom-left-radius: 20rpx; /*左上角*/
			border-bottom-right-radius: 20rpx; /*右上角*/
			// top: 0 !important;
			&__swiperbox{
				height: 170rpx;
				&__draw-ul{
					height:150rpx;
					margin-bottom:20rpx;
					padding-bottom:10rpx;
					border-bottom: 1px solid #C0C0C0;
					margin-bottom: 10rpx;
					border-bottom-left-radius: 20rpx; /*左上角*/
					border-bottom-right-radius: 20rpx; /*右上角*/
					&__title{
						font-weight: bold;
						font-size: 28rpx;
						margin: 10rpx ;
					}
					&__jia{
						font-size: 40rpx;
						line-height: 75rpx;
					}
					&__li{
						width:12.5%;
						text-align: center;
						font-weight: bold;
						float: left;
						&__code{
							width: 50rpx;
							height: 50rpx;
							border-radius: 100%;
							margin: 0 auto;
							color:#FFFFFF;
							line-height: 50rpx;
							font-size: 28rpx;
						}
					}
				}
			}
		}
		
		
		
	}

</style>
